<template>
	<view class="content">
		<view class="top">
			<u-count-to color="#ffffff" :fontSize="58" :duration="1500" :startVal="0" :endVal="nowVal"></u-count-to>
			
			<view class="top-but" @click="open()"> 成长趋势图 </view>
		</view>
		<view class="con-box">
			<view class="con" v-for="(item, index) in pageResult.list" :key="index">
				<view class="con-left">
					
					<view class="con-title"> {{item.remark}} </view>
					<view class="con-time"> {{item.create_time}} </view>
				</view>
				<view class="con-right">
					<view :class="item.trade_type == 1 ? 'con-number1' : 'con-number3'"> {{item.trade_type == 1 ? '+' : '-'}}{{item.num}} </view>
					<view class="con-number2"> {{item.old_num}} </view>
				</view>
			</view>
		</view>
		
		<chartsPopup ref="chartsPopup" type="2"></chartsPopup>
	</view>
</template>

<script>
	import serve from '../static/request.js';
	import storage from '../static/appkey.js';
	import common from '../static/jump.js';
	export default {
		data() {
			return {
				nowVal: 0,
				pageParam: {
					appkey: uni.getStorageSync('appkey'),
					page: 0,
				},
				pageResult: {
					list: [],
					isEmpty: false,
					isEnd: false,
				},
				

			};
		},
		methods: {
			open() {
				this.$refs.chartsPopup.open();
			},

			getInfo(){
				var self = this;
				serve.request({
					url: '/tea/growup/index',
					data: self.pageParam
				}).then(res => {
					self.nowVal = res.data.nowVal
					
				});
			},
			getList() {
				var self = this;
				self.pageParam.page++
				serve.request({
					url: '/tea/growup/list',
					data: self.pageParam
				}).then(res => {
					console.log(res.data);
					if (res.data && res.data.length > 0) {
						self.pageResult.list = self.pageResult.list.concat(res.data);
					}
					self.pageResult.isEmpty = self.pageResult.list.length == 0;
					self.pageResult.isEnd = res.data.length == 0;
				});
			},

			
			
			jump(jump_type, jump_link) {
				common.jump(jump_type, jump_link);
			},
		},
		async onLoad() {
			await this.$defaultLogin();
			this.pageParam.page = 0;
			this.pageResult.list = [];
			this.getList();
			this.getInfo();
		},
		onShow() {
		},
		onPullDownRefresh() {
			this.pageParam.page = 0;
			this.pageResult.list = [];
			this.getList();
			this.getInfo();
		},
		onReachBottom() {
			if (this.pageResult.isEnd || this.pageResult.isEmpty) {
				return
			}
			this.getList();
		}
	};
</script>

<style lang="scss" scoped>
	.content{
		color: #333333;
		font-size: 32rpx;
	}
	.top{
		position: relative;
		width: 100%;
		height: 325rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 24rpx;
		color: white;
		background-image: url(https://hdsq.aoorange.cn/attachment/xcx/icon/forceDetail_bg.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}
	.top-but{
		width: 220rpx;
		height: 54rpx;
		line-height: 54rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 27rpx;
		margin-top: 60rpx;
		color: #FFFFFF;
		font-size: 24rpx;
		text-align: center;
	}
	
	.con-box{
		padding: 30rpx;
	}
	.con{
		display: flex;
		justify-content: center;
		align-items: center;
		border-bottom: 2rpx solid #e5e5e5;
		padding: 20rpx 0;
	}
	.con-left{
		text-align: left;
		flex: 7;
	}
	.con-title{
		color: #3c4868;;
	}
	.con-time{
		margin-top: 20rpx;
		font-size: 24rpx;
		color: rgba(60, 72, 104, 0.5);
	}
	.con-right{
		text-align: right;
		flex: 3;
		
	}
	.con-number1{
		font-size: 38rpx;
		color: #ffc80a;
		font-weight: bold;
	}
	.con-number2{
		margin-top: 20rpx;
		font-size: 30rpx;
		color: #999999;
	}
	.con-number3{
		font-size: 38rpx;
		color: #EB5938;
		font-weight: bold;
	}
	
</style>
